<template>
  <el-dialog :visible.sync="dialog" title="查看流程历史" append-to-body top="0" width="85%" @open="open">
    <div  style="overflow: auto">
      <img :src="flowImage">
    </div>
  </el-dialog>
</template>

<script>
  import {getImage} from '@/api/framework/flow/flowProcess'

  export default {
    name: "HistoryImage",
    props: {
      processDefinitionId: {
        type: String,
        required: true
      },
      executionId: {
        type: String,
        required: true
      }
    },
    data() {
      return {
        flowImage: '',
        dialog: false
      }
    },
    methods: {
      open() {
        getImage(this.processDefinitionId, this.executionId).then(res => {
          this.flowImage = 'data:image/png;base64,' + btoa(
            new Uint8Array(res)
              .reduce((data, byte) => data + String.fromCharCode(byte), '')
          )
        }).catch(err => {
          this.dialog = false
          console.log(err.response.data.message)
        })
      }
    }
  }
</script>

<style scoped>

</style>
